@require '~styles/variables'
@require '~styles-lib/mixins'

.-attachment-controls
	margin-bottom: $line-height-computed

	@media $media-xs
		white-space: nowrap
		overflow-x: scroll
		overflow-y: hidden

.-upload-input
	display: none

.-lead-form-group
	margin-bottom: 10px

.-hp
	display: flex
	align-items: center
	margin-top: 5px

	&-label
		theme-prop('color', 'fg-muted')
		flex: none
		margin-right: 10px
		font-size: $font-size-small
		font-weight: bold

	&-bar
		flex: auto

		.progress
			margin-bottom: 0

	&-count
		theme-prop('color', 'notice')
		flex: none
		margin-left: 10px
		font-size: $font-size-small
		font-weight: bold

.-post-tags
	margin-top: 10px
	margin-bottom: 10px

.-as-owner
	clearfix()

	&-item
		float: left
		margin-right: 10px

	&-avatar
		width: $input-height-base

.-poll-option
	display: flex

	.form-group
		flex-grow: 1
		margin-bottom: ($font-size-base / 2)

	&-remove
		width: 40px
		line-height: $input-height-base
		text-align: center

.-poll-duration
	.form-group
		margin-bottom: 0

.-linked-accounts
	.form-group
		margin-bottom: 0

.-linked-account
	display: flex
	align-items: center
	margin-top: 10px

	&-icon
		flex: none
		margin-right: 10px

	&-label
		flex: auto
		margin-right: 10px

	&-toggle
		flex: none

.-communities
	margin-bottom: 10px
	display: flex
	align-items: center

.-communities-label
	theme-prop('color', 'fg-muted')
	flex: none
	margin-right: 10px
	font-size: $font-size-small
	font-weight: bold

.-communities-list
	flex: auto

@media $media-xs
	.-controls
		display: flex
		flex-direction: column

		&-attachments
			display: flex
			justify-content: center
			margin-bottom: $line-height-computed
			padding: 10px 0
			border-top: 1px solid var(--theme-bg-subtle)
			border-bottom: 1px solid var(--theme-bg-subtle)

		&-submit
			display: flex

			&-button
				flex: 1 0
				margin-right: 10px
				margin-left: 10px

				&:first-of-type
					margin-left: 0

				&:last-of-type
					margin-right: 0

@media $media-sm-up
	.-controls
		display: flex
		flex-direction: row

		&-attachments
			flex: auto

		&-submit
			flex: none

			&-button
				display: inline-block
